<link rel="stylesheet" type="text/css" href="<?php echo TEMPLATES_PATH;?>/css/login.css">
<script type="text/javascript" src="<?php echo RESOURCE_PATH;?>/js/jquery.validation.min.js"></script>
<script type="text/javascript" src="<?php echo RESOURCE_PATH;?>/js/jquery.metadata.js" charset="utf-8"></script>
<script type="text/javascript" src="<?php echo TEMPLATES_PATH;?>/js/area_array.js" charset="utf-8"></script>
<script type="text/javascript" src="<?php echo TEMPLATES_PATH;?>/js/common_select.js" charset="utf-8"></script>
<script>
    $(function(){
        <?php if($output['code_reg']==true){?>
            $('.registerWay div:first').addClass('bg-d60079 text-white');
        <?php }else{?>
            $('.registerWay div:last').addClass('bg-d60079 text-white');
        <?php }?>
        //地区下拉列表 S
        var area_select = $("#province_id");
        areaInit(area_select,0);//初始化地区
        // 选择地区
        $("#province_id").change(provinceChange);
        function provinceChange(){
            // 删除后面的select
            $(this).nextAll().remove();
            if (this.value > 0){
                var text = $(this).get(0).options[$(this).get(0).selectedIndex].text;
                var area_id = this.value;
                var EP = new Array();
                EP[1]= true;EP[2]= true;EP[9]= true;EP[22]= true;EP[34]= true;EP[35]= true;
                if(typeof(nc_a[area_id]) != 'undefined'){//数组存在
                    var areas = new Array();
                    var option = "";
                    areas = nc_a[area_id];
                    //if (typeof(EP[area_id]) == 'undefined'){
                    option = "<option value=''>-请选择-</option>";
                    //}
                    $("<select name='city_id' id='city_id' class=\"{required:true,messages:{required:'请选择城市'}}\">"+option+"</select>").insertAfter(this);
                    for (i = 0; i <areas.length; i++){
                        $(this).next("select").append("<option value='" + areas[i][0] + "'>" + areas[i][1] + "</option>");
                    }
                }
            }
        }
        $('#city_id').live('change', function() {
            // 删除后面的select
            $(this).nextAll("select").remove();
            if (this.value > 0){
                var text = $(this).get(0).options[$(this).get(0).selectedIndex].text;
                var area_id = this.value;
                var EP = new Array();
                EP[1]= true;EP[2]= true;EP[9]= true;EP[22]= true;EP[34]= true;EP[35]= true;
                if(typeof(nc_a[area_id]) != 'undefined'){//数组存在
                    var areas = new Array();
                    var option = "";
                    areas = nc_a[area_id];
                    if (typeof(EP[area_id]) == 'undefined'){
                        option = "<option value=''>-请选择-</option>";
                    }
                    $("<select name='area_id' id='area_id' class=\"{required:true,messages:{required:'请选择地区'}}\">"+option+"</select>").insertAfter(this);
                    for (i = 0; i <areas.length; i++){
                        $(this).next("select").append("<option value='" + areas[i][0] + "'>" + areas[i][1] + "</option>");
                    }
                }
            }
        });
        //用户名为数字，下划线，字母，汉子，其他通不过。添加用jquery验证用户名的方法
        jQuery.validator.addMethod("regName_v", function(value, element) {
            return this.optional(element) || /^[\u4E00-\u9FA5\w-]{3,20}$/.test(value);
        });
        //添加用jquery验证密码的方法
        jQuery.validator.addMethod("pwd_v", function(value, element) {
            return this.optional(element) || /^[\w-\,\.\?\!]{6,20}$/.test(value);
        });
        //添加用jquery验证手机的方法
        jQuery.validator.addMethod("mob_v", function(value, element) {
            return this.optional(element) || /(^1[3578]\d{5}$)|(^1[3578]\d{9}$)/.test(value);
        });
    });//E
    /*发送手机验证码*/
    function sendMobileCode() {
        var countdown;
        if( !((/^1[34578][0-9]\d{4,8}$/).test($('#mobile').val()))){alert('请输入正确的手机号码');return false;}
        var count = 60;
        function CountDown() {
            $("#dyMobileButton").attr("disabled", true);
            $("#dyMobileButton").val( count + "秒后重新获取");
            if (count == 0) {
                $("#dyMobileButton").val("获取短信验证码").removeAttr("disabled");
                clearInterval(countdown);
            }
            count--;
        }
        $.getJSON('index.php?act=register&op=ajax_get_code_reg_mobile',{mobile:$('#mobile').val(),captcha:$('#captcha').val()},function (data){
            if(data.state==false){
                alert(data.msg);
            }else{
                countdown = setInterval(CountDown, 1000);
            }
        });
    }/*手机验证*/

</script>
<!--注册S-->
<header class="layout head padding-small">
    <a href="javascript:back(true);" class="hBack float-left"></a>
    <h4 class="hTxt float-left text-center text-white"><?php echo $output['title']?></h4>
    <a href="javascript:;" id="btnJdkey" class="hHlep float-right"></a>
</header>
<?php if($output['code_reg']==true){?>
    <div class="register layout padding">
        <form action="#" method="post" id="reg_form" class="form-tips">
            <input type="hidden" name="form_submit" value="ok">
            <input name="nchash" type="hidden" value="<?php echo $output['nchash'];?>">
            <!--注册方式S-->
            <div class="registerWay radius-big bg-white margin-bottom clearfix text-center ">
                <a href="index.php?act=register"> <div class="codeRegister-btn x6 padding ">邀请码注册</div></a>
                <a href="index.php?act=register&op=no_code_reg"> <div class="noCodeRegister-btn x6 padding ">非邀请码注册</div></a>
            </div>
            <!--注册方式E-->
            <!--邀请码方式（默认）S-->
            <div class="codeRegister padding-top">
                <div class="codeRegisterTxt   form-group">
                    <div class="clearfix bg-white radius-big">
                        <span class="float-left letter-spacing">用户名：</span>
                    <span class="float-left text-small field">
                        <input type="text" id="user_name" name="user_name" placeholder="请输入字母、数字或中文，3-20个字符" class="border-none" >
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big">
                        <span class="float-left  letter-spacing">邀请码：</span>
                    <span class="float-left text-small  field">
                    	<input type="text" id="code" name="code" placeholder="请输入我们提供的邀请码" class="border-none" >
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big">
                        <span class="float-left ">设置密码：</span>
                    <span class="float-left text-small field">
                    	<input type="password" id="password" name="password"  placeholder="请输入6-20位，字母、数字或常用符号" class="border-none" >
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt form-group">
                    <div class="clearfix  bg-white radius-big ">
                        <span class="float-left ">确定密码：</span>
                    <span class="float-left text-small field">
                    	<input type="password" id="password_confirm" name="password_confirm"  placeholder="再次输入密码" class="border-none">
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big ">
                        <span class="float-left  letter-spacing">所在地：</span>
                    <span class="float-left text-small field">
                        <select name="province_id" id="province_id" class="check border-none {required:true,messages:{required:'请选择省份'}}" >
                        </select>
                    </span>
                    </div>
                    <div class="text-red  text-small">∗所在地注册成功后不可更改，请您认真选择∗</div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix  bg-white radius-big ">
                        <span class="float-left ">验证码：</span>
                    <span class="float-left text-small field">
                    	<input type="text" id="captcha" name="captcha"  placeholder="请输入下面的验证码" class="border-none">
                    </span>
                    </div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big ">
                    <img src="index.php?act=seccode&op=makecode&nchash=" name="codeimage" border="0" id="codeimage" class="border-none float-left ">
                    <a href="javascript:void(0)" onclick="javascript:document.getElementById('codeimage').src='index.php?act=seccode&op=makecode&nchash=&t=' + Math.random();" class="float-left padding  margin-left radius-big bg-yellow text-white">看不清，换一张</a>
                    </div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big ">
                        <span class="float-left ">验证手机：</span>
                    <span class="float-left text-small field">
                    	<input type="text" name="mobile" id="mobile" placeholder="请输入需要验证的手机号" class="border-none" maxlength="11">
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt clearfix form-group text-small">
                    <div class="float-left radius-big  bg-white field margin-right">
                        <input type="text" name="mobileCode" id="mobileCode" placeholder="短信验证码" class="border-none" maxlength="6" >
                    </div>
                    <input type="button" id="dyMobileButton" onclick="sendMobileCode()" class="text-white bg-ef7f7e float-left border-none radius-big padding text-center" value="获取短信验证码">
                </div>
            </div>
            <!--邀请码方式（默认）E-->
            <div class="userTxt margin-bottom clearfix">
                <input type="checkbox" value="1" name="agree" id="agree" checked="checked"> <a onclick="javascript:$('#agreement').removeClass('hidden');" href="#agreement" class="text-ef7f7e">阅读并同意服务协议</a>
            </div>
            <div class="margin-bottom form-button">
                <input type="hidden" name="register_type" value="1">
                <input type="submit" class="text-white bg-d60079 border-none radius-big padding text-center layout text-big" value="注册">
            </div>
        </form>
        <!--用户服务协议-->
        <div id="agreement" class="hidden">
            <h3 style="text-align:center;"><?php echo $output['doc']['doc_title']?></h3>
            <?php echo $output['doc']['doc_content']?>
        </div>
    </div>
    <script type="text/javascript">
        //输入框滚动
        $(function(){
            $("#reg_form").find('input:not(:button)').focus(function(){
                $('body,html').animate({'scrollTop':$(this).offset().top-60},100);
            })
            $("#reg_form ").validate({
                errorPlacement: function(error, element){
                    var error_td = element.parent('span');
                    error_td.append(error);
                },
                rules: {
                    user_name: {
                        required	: true,
                        regName_v:true,
                        minlength   : 3,
                        remote   : {
                            url : 'index.php?act=register&op=checkName',
                            type: 'get',
                            data:{
                                user_name : function(){
                                    return $('#user_name').val();
                                }
                            }
                        }
                    },
                    code: {
                        required	: true,
                        remote   : {
                            url : 'index.php?act=register&op=checkCode',
                            type: 'get',
                            data:{
                                code : function(){
                                    return $('#code').val();
                                }
                            }
                        }
                    },
                    password : {
                        required	:	true,
                        pwd_v:true
                    },
                    password_confirm : {
                        required	:	true,
                        equalTo	:	'#password'
                    },
                    agree : {
                        required	:	true
                    },
                    mobile:{
                        required	:	true,
                        mob_v:true,
                        remote   : {
                            url : 'index.php?act=register&op=checkMobile',
                            type: 'get',
                            data:{
                                mobile : function(){
                                    return $('#mobile').val();
                                }
                            }
                        }
                    },
                    mobileCode:{
                        required:true,
                        remote   : {
                            url : 'index.php?act=register&op=ajax_check_mobcode',
                            type: 'get',
                            data:{
                                mobileCode : function(){
                                    return $('#mobileCode').val();
                                }
                            }
                        }
                    },
                    <?php if(true ) { ?>
                    captcha : {
                        required : true,
                        remote   : {
                            url : 'index.php?act=seccode&op=check&nchash=<?php echo $output['nchash'];?>',
                            type: 'get',
                            data:{
                                captcha : function(){
                                    return $('#captcha').val();
                                }
                            }
                        }
                    }
                    <?php } ?>
                },
                messages: {
                    user_name: {
                        required	: '用户名不能为空',
                        regName_v:"用户名为3-20位汉字/字母/数字",
                        minlength   : "用户名为3-20位汉字/字母/数字",
                        remote   : '用户名已存在'
                    },
                    code	:	{
                        required : "邀请码不能为空",
                        remote :	'邀请码已被使用或无效的邀请码'
                    },
                    password	:	{
                        required : "密码不能为空",
                       pwd_v:'密码为6~20位的字母/数字/常用符号'
                    },
                    password_confirm : {
                        required	:	'确认密码不能为空',
                        equalTo	:	'确认密码与密码不一致'
                    },
                    mobile : {
                        required : '手机号不能为空',
                        mob_v:'输入合法的手机号',
                        remote:'手机号码已被注册'
                    },
                    mobileCode : {
                        required : '短信验证码不能为空',
                        remote:'短信验证码错误'
                    },
                    agree : {
                        required	:	'请阅读并同意该协议'
                    },

                    <?php if(true) { ?>
                    captcha : {
                        required : '验证码不能为空',
                        remote	 : '验证码输入错误'
                    }
                    <?php } ?>
                }
            });
        });
    </script>

<?php }else{?>
    <div class="register layout padding">
        <form action="#" method="post" id="nocode_reg_form"  class="form-tips" enctype="multipart/form-data">
            <!--注册方式S-->
            <div class="registerWay radius-big bg-white margin-bottom clearfix text-center ">
                <a href="index.php?act=register"> <div class="codeRegister-btn x6 padding ">邀请码注册</div></a>
                <a href="index.php?act=register&op=no_code_reg">  <div class="noCodeRegister-btn x6 padding ">非邀请码注册</div></a>
            </div>
            <!--注册方式E-->
            <!--普通方式（非邀请码）S-->
            <input type="hidden" name="form_submit" value="ok" />
            <input name="nchash" type="hidden" value="<?php echo $output['nchash'];?>" />
            <div class="noCodeRegister">
                <div class="codeRegisterTxt   form-group">
                    <div class="clearfix bg-white radius-big">
                        <span class="float-left letter-spacing">用户名：</span>
                    <span class="float-left text-small field">
                        <input type="text" id="regName" name="regName" placeholder="请输入字母、数字或中文，3-20个字符" class="border-none"  maxlength="20">
                    </span>
                    </div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big">
                        <span class="float-left ">设置密码：</span>
                    <span class="float-left text-small field">
                    	<input type="password" id="pwd" name="pwd"  placeholder="请输入6-20位，字母、数字或常用符号" class="border-none">
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt form-group">
                    <div class="clearfix  bg-white radius-big ">
                        <span class="float-left ">确定密码：</span>
                    <span class="float-left text-small field">
                    	<input type="password" name="pwdRepeat" id="pwdRepeat"  placeholder="再次输入密码" class="border-none">
                    </span>
                    </div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big ">
                        <span class="float-left  letter-spacing">所在地：</span>
                    <span class="float-left text-small field">
                        <select name="province_id" id="province_id" class="check border-none {required:true,messages:{required:'请选择省份'}}" >
                        </select>

                    </span>
                    </div>
                    <div class="text-red  text-small">∗所在地注册成功后不可更改，请您认真选择∗</div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix  bg-white radius-big ">
                        <span class="float-left ">验证码：</span>
                    <span class="float-left text-small field">
                    	<input type="text" id="captcha" name="captcha"  placeholder="请输入下面的验证码" class="border-none">
                    </span>
                    </div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big ">
                        <img src="index.php?act=seccode&op=makecode&nchash=" name="codeimage" border="0" id="codeimage" class="border-none float-left ">
                        <a href="javascript:void(0)" onclick="javascript:document.getElementById('codeimage').src='index.php?act=seccode&op=makecode&nchash=&t=' + Math.random();" class="float-left padding  margin-left radius-big bg-yellow text-white">看不清，换一张</a>
                    </div>
                </div>
                <div class="codeRegisterTxt form-group">
                    <div class="clearfix bg-white radius-big ">
                        <span class="float-left ">验证手机：</span>
                    <span class="float-left text-small field">
                    	<input type="text" name="mobile" id="mobile" placeholder="请输入需要验证的手机号" class="border-none">
                    </span>
                    </div>
                </div>

                <div class="codeRegisterTxt clearfix form-group text-small">
                    <div class="float-left radius-big  bg-white field margin-right">
                        <input type="text" name="mobileCode" id="mobileCode"  placeholder="短信验证码" class="border-none" maxlength="6">
                    </div>
                    <input type="button" onClick="sendMobileCode()" id="dyMobileButton" class="text-white bg-ef7f7e float-left border-none radius-big padding text-center" value="获取短信验证码">
                </div>
                                <div class="codeRegisterTxt form-group text-small">
                    <div class="bg-white radius padding">
                        <div class="new-input-span margin-bottom">
                            身份证正面照：
                            <input type="file" class="file_upload" name="member_idcard" id="member_idcard">
                        </div>
                        <div class="new-input-span margin-bottom">
                            身份证反面照：
                            <input type="file" class="file_upload" name="member_idcard_r" id="member_idcard_r">
                        </div>
                        <div class="new-input-span">
                            店内照片：
                            <input type="file" class="file_upload" name="member_inside_photo" id="member_inside_photo">
                            <p class="text-ef7f7e"> 店内照片注意：请上传本人手持身份证照片，站在吧台内，确保身份证号码清晰。</p>
                        </div>
                    </div>
                </div>
            </div>
            <!--普通方式（非邀请码）E-->
            <div class="userTxt margin-bottom clearfix">
                <input type="checkbox" value="1" name="auto_login" id="auto_login" checked="checked"> <a onclick="javascript:$('#agreement').removeClass('hidden');"  href="#agreement" class="text-ef7f7e">阅读并同意服务协议</a>
            </div>

            <div class="margin-bottom form-button">
                <input type="hidden" name="register_type" value="2">
                <input type="submit" class="text-white bg-d60079 border-none radius-big padding text-center layout text-big" value="注册">
            </div>
        </form>

    </div>
    <!--用户服务协议-->
    <div id="agreement" class="hidden">
        <h3 style="text-align:center;"><?php echo $output['doc']['doc_title']?></h3>
        <?php echo $output['doc']['doc_content']?>
    </div>
    <script type="text/javascript">
        $(function(){
            //点击输入框时向上滚动
            $("#nocode_reg_form").find('input:not(:button)').focus(function(){
                $('body,html').animate({'scrollTop':$(this).offset().top-60},100);
            });
            //邀请会员和用户名是一样的验证规则
            jQuery.validator.addMethod("invite_v", function(value, element) {
                return this.optional(element) || /^[\u4E00-\u9FA5\w-]{3,20}$/.test(value);
            });
            $("#nocode_reg_form ").validate({
                errorPlacement: function(error, element){
                    var error_td = element.parent('span,div');
                    error_td.append(error);
                },
                rules: {
                    regName: {
                        required	: true,
                        regName_v   :true,
                        minlength   : 3,
                        remote   : {
                            url : 'index.php?act=register&op=checkName',
                            type: 'get',
                            data:{
                                user_name : function(){
                                    return $('#regName').val();
                                }
                            }
                        }
                    },
                    pwd : {
                        required	:	true,
                        pwd_v       :true
                    },
                    pwdRepeat : {
                        required	:	true,
                        equalTo	:	'#pwd'
                    },
                    area_id : { required : true},
                    mobile: {
                        required	: true,
                        mob_v 	: true,
                        remote   : {
                            url : 'index.php?act=register&op=checkMobile',
                            type: 'get',
                            data:{
                                mobile : function(){
                                    return $('#mobile').val();
                                }
                            }
                        }
                    },
                    mobileCode:{
                        required: true,
                        remote   : {
                            url : 'index.php?act=register&op=ajax_check_mobcode',
                            type: 'get',
                            data:{
                                mobileCode : function(){
                                    return $('#mobileCode').val();
                                }
                            }
                        }
                    },

                    //如果显示时才验证,隐藏不用验证
                    member_idcard:{
                        required: true
                    },
                    member_idcard_r:{
                        required: true
                    },
                    member_inside_photo:{
                        required: true
                    },
                    <?php if(false) { ?>
                    captcha : {
                        required : true,
                        remote   : {
                            url : 'index.php?act=seccode&op=check&nchash=<?php echo $output['nchash'];?>',
                            type: 'get',
                            data:{
                                captcha : function(){
                                    return $('#captcha').val();
                                }
                            }
                        }
                    },
                    <?php } ?>
                    agree : {
                        required	:	true
                    }
                },
                messages: {
                    regName: {
                        required	: '用户名不能为空',
                        regName_v   : '用户名是3-20位汉字/字母/数字/下划线',
                        minlength   : "用户名为3-20位汉字/字母/数字",
                        remote   : '用户名已存在'
                    },
                    pwd : {
                        required	:	'密码不能为空',
                        pwd_v       :'密码为6~20位的字母/数字/常用符号'
                    },
                    pwdRepeat : {
                        required	:	'确认密码不能为空',
                        equalTo	:	'确认密码与密码不一致'
                    },
                    area_id:{
                        required:'所在地不能为空'
                    },
                    mobile: {
                        required	: '手机号码不能为空',
                        mob_v	:	'手机号码输入错误',
                        remote   :	'手机号码已存在'
                    },
                    mobileCode:{
                        required: '短信验证码不能为空',
                        remote:'短信验证码错误'
                    },
                    member_idcard:{
                        required: '请上传身份证正面照'
                    },
                    member_idcard_r:{
                        required: '请上传身份证反面照'
                    },
                    member_inside_photo:{
                        required: '请上传店内照片'
                    },
                    <?php if(false ) { ?>
                    captcha : {
                        required : '验证码不能为空',
                        remote   : '验证码输入错误'
                    },
                    <?php } ?>
                    agree : {
                        required	:	'请阅读并同意该协议'
                    }
                }
            });
        });
    </script>
<?php }?>